<template>
    <Row style="background:#eee;padding:10px" :gutter="16" align="middle">
        <Col span="4" v-for="item in 10">
            <Card style="width:240px">
                <div style="text-align:center">
                    <a @click="goodsDetailClick()">
                        <img style="width: 220px;height: 220px"
                             src="https://img30.360buyimg.com/babel/s320x320_jfs/t1/103394/16/15658/188689/5e743a13E71fff7f2/7fe45d5dba81ab8a.jpg!q60!cc_320x320.webp"/>
                        <h3>￥14.90</h3>
                    </a>
                </div>
            </Card>
        </Col>
    </Row>
</template>

<script>
    export default {
        name: "Food",
        methods:{
            goodsDetailClick() {
                return this.$router.push('/goodsDetail')
            }
        }
    }
</script>

<style scoped>

</style>
